<template>
  <div class="upload">
    <el-upload
      ref="upload"
      :action="fileType =='personnel'?uploadOptions.urlPersonnel:uploadOptions.urlDrugs"
      :headers="uploadOptions.header"
      class="upload-demo"
      name="file"
      accept=".xls, .xlsx"
      :file-list="fileList"
      :on-success="handleAvatarSuccess"
      :on-change="handleAvatarProgress"
    >
      <el-button slot="trigger" class="ml10 mr10" size="mini" type="primary">导入</el-button>
    </el-upload>
  </div>
</template>

<script>
import { getToken } from '@/utils/auth';
class UploadOptions {
  // url = process.env.VUE_APP_BASE_API + '/files/imgUpload';
  // urlDrugs = process.env.VUE_APP_BASE_API + '/drugs/imp';
  urlDrugs = window.server.SERVER_API[0].api + 'drugs/imp';
  // urlPersonnel = process.env.VUE_APP_BASE_API + '/person/imp';
  // urlPersonnel = window.server.SERVER_API[0].api + '/person/imp';
  urlPersonnel = window.server.SERVER_API[0].api + 'business/formula/imp';
  // url = getToken('api_domain') + '/files/imgUpload';
  header = {
    'Authentication': getToken('auth_key') ? getToken('auth_key') : '',
    'userId': getToken('session_id') ? getToken('session_id') : '',
    'clientType': 0
  }
}

export default {
  name: 'ImgUploadOne',
  props: {
    width: {
      type: String,
      default: '146px'
    },
    height: {
      type: String,
      default: '146px'
    },
    fileType: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      uploadOptions: new UploadOptions(),
      fileList: []
    };
  },
  watch: {

  },
  mounted() {
    // console.log(this.existUrl);
    // this.imgUrl = this.existUrl;
    // if (this.fileDir) {
    //   this.uploadOptions.header['file-dir'] = this.fileDir;
    // }
    this.fileList = [];
  },
  methods: {
    // 初始化图片显示
    // open() {
    //   this.imgUrl = '';
    // },
    // 图片上传校验
    beforeAvatarUpload(file) {
      console.log(file);
      if (file.type.indexOf('image') == -1) {
        this.$message.error('请上传正确的图片格式');
        return false;
      }
      const isLt10M = file.size / 1024 / 1024 < 10;
      if (!isLt10M) {
        this.$message.error('上传凭证图片大小不能超过10MB!');
        return false;
      }
    },
    // 上传图片成功回调
    handleAvatarSuccess(res) {
      this.$emit('handleAvatarSuccess', res);
      this.fileList = [];
    },
    // 上传图片失败回调
    handleAvatarProgress(res) {
      // console.log(res);
      // if (res) {
      //   const { data } = res;
      //   this.imgUrl = {
      //     absoluteUrl: data.file_path,
      //     relativeUrl: data.save_name
      //   };
      //   this.$emit('setUrl', this.imgUrl);
      // } else {
      //   this.$message.info(res.msg);
      // }
    }
  }
};
</script>

<style scoped lang="scss">
</style>
